<template>
  <div style="width: 100vw;height: 100vh;">
    <!-- <div style="color:'#fff'">{{ $route }}</div> -->
    <div class="box-div" v-show="!$route.name">
      <div class="menu">
        <router-link to="/GlobalInfo">工厂级运营看板</router-link>
        <router-link to="/ProductInfo">注塑车间生产看板</router-link>
        <router-link to="/InspectInfo">检验看板</router-link>
        <router-link to="/WarehouseInfo">仓库监控实时看板</router-link>
        <router-link to="/ZhuangpeiProductInfo">组装车间生产看板</router-link>
      </div>
    </div>
    <router-view :time="time"></router-view>
  </div>
</template>

<script>
import { bnrQuery } from './api/dataApi'
import moment from 'moment'

export default {
  name: 'Main',
  data() {
    return {
      wcList: [],
      time: '',
    }
  },
  provide: {},
  created() {
  },
  mounted() {
  },
  methods: {
    getData() {
      const that = this
      const header = {}
      header['report.tableid'] = 'bne_current_time'
      const params = {
        _params: JSON.stringify(header),
        _conditions: {},
        pageIndex: -1,
      }
      bnrQuery(params).then((res) => {
        if (res.code == 0 && res.data.length > 0) {
          that.time = moment(res.data[0].date).format('YYYY-MM-DD')
        } else {
          that.time = ''
        }
      })
    },
  },
}
</script>
<style lang="less" scoped>
.box-div {
  width: 900px;
  margin: 0 auto;
  padding-top: 10vh;
}
.menu {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
  flex-wrap: wrap;
  gap: 10px;
  a {
    width: 24%;
    height: 100px;
    word-break: normal;
    line-height: 100px;
    background: rgba(0, 118, 209, 0.3);
    .px2font(22);
    color: #fff;
    border-radius: 8px;
  }
  a:hover {
    background: rgba(0, 118, 209, 0.5);
  }
}
.menu2 {
  padding-top: 5%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
  flex-wrap: wrap;
  gap: 10px;

  a {
    width: 24%;
    height: 100px;
    word-break: normal;
    line-height: 100px;
    background: rgba(0, 118, 209, 0.3);
    .px2font(22);
    color: #fff;
    border-radius: 8px;
  }
  a:hover {
    background: rgba(0, 118, 209, 0.5);
  }
}
</style>
